<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="vue.js"></script>
</head>
<body>
<div id="root">
   <child ></child>
</div>


<script>

    Vue.component('child', {
        props: {
            content: {
                type: String,
                required: false,
                default: 'asdsada',
                validator: function (value) {
                    return (value.length > 6)
                }
            }
        },
        template: '<div>{{content}}</div>'
    })

    // Vue.component('child', {
    //     props: {
    //         content: {
    //             type: String,
    //             required: false,
    //             default: 'asdsada',
    //             validator: function (value) {
    //                 return (value.length > 6)
    //             }
    //         }
    //     },
    //     template: '<div>{{content}}</div>'
    // })

    var vm = new Vue({
        el: '#root'

    })
</script>
</body>
</html>